Best of Modern JavaScript — Regex u Flag and Timers

Since 2015, JavaScript has improved immensely.

It’s much more pleasant to use it now than ever.

In this article, we’ll look at new JavaScript regex features and timers.

The u Flag

The u flag is another flag that’s introduced with ES6.

It switches on Unicode mode for regexes.

The most can recognize Unicode point escape sequences like u{094F} in our regex.

Also, characters in the regex pattern and the string are also recognized as code points.

Code units are converted into code points.

In non-Unicode mode, a lone surrogate matches surrogate pair code points.

For example, if we have:

/uD83D/.test("uD83DuDC2B")

We get true returned.

With Unicode mode on, this will return false since the 2 code points should be put together to create one character.

So /uD83D/u.test(“uD83DuDC2B”) returns false .

Actual lone surrogates are still matched with the u flag on:

/uD83D/u.test("uD83D uD83DuDC2B")

So the expression above returns true .

This means that 2 code points together will be interpreted as the one correct character in Unicode mode.

The dor operator will match code points instead of code units.

For instance:

'uD83DuDC2B'.match(/./gu).length

returns .

But:

'uD83DuDC2B'.match(/./g).length

returns 2.

In Unicode mode, quantifiers apply to code points.

But in non-Unicode mode, they apply to single code units.

So if we have:

/uD83DuDC2B{2}/u.test("uD83DuDC2BuD83DuDC2B")

This will return true .

But:

/uD83DuDC2B{2}/.test("uD83DuDC2BuD83DuDC2B")

returns false .

flags Property

The flags property is a new property of a regex object.

It returns the flags that’s added to the regex.

For example, if we have:

/foo/gy.flags

We get “gy” .

We can’t change the flags of an existing regex.

But we can use the flags property to make a copy of a regex with the flags.

For instance, we can write:

const regex = /foo/gy
const copy = new RegExp(regex.source, regex.flags);

The source property has the regex pattern.

And flags has the flags.

RegExp Constructor

The RegExp constrictor is useful for copying regexes as we can see.

It takes the pattern and the flags.

String Methods that Delegate to Regex Methods

Some string instance methods delegate to regex instance methods.

They’re:

• String.prototype.match calls RegExp.prototype[Symbol.match]
• String.prototype.replace calls RegExp.prototype[Symbol.replace]
• String.prototype.search calls RegExp.prototype[Symbol.search]
• String.prototype.split calls RegExp.prototype[Symbol.split]

Async Programming

JavaScript has extensive async programming features.

Each browser tab runs in a single process called the event loop.

The loop runs browser-related things that’s fed via the task queue.

Tasks include parsing HTML, running JavaScript code, listening to user input, and more.

Timers

JavaScript has the setTimeout to delay the execution of a piece of code.

It takes a callback to run the code after a given delay.

The first argument is the callback to run.

And the 2nd is the number milliseconds after now to add the callback to the queue.

Once it’s called, the callback is added to the task queue.

The delay specifies when the callback is added, not when it actually runs.

This may happen later.

DOM Changes

DOM changes don’t happen immediately.

It happens every 16ms.

Conclusion

The u flag lets us enable Unicode mode to let us search for Unicode strings properly.

setTimeout lets us run code with a delay.